import 'package:base_lib/common/widget/peach_button.dart';
import 'package:base_lib/index.dart';
import 'package:doctor_login_lib/certification/bloc.dart';
import 'package:doctor_login_lib/certification/entity/save_certify_photo_entity.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:image_picker/image_picker.dart';
import 'package:fsuper/fsuper.dart';
import 'entity/save_certify_photo_entity.dart' as SaveCertifyPhotoBean;

///实名认证
class CertificationPage
    extends BaseBlocPage<CertificationBloc, _CertificationPageState> {
  CertificationPage(Parameters parameters) : super(parameters);

  @override
  _CertificationPageState generateThemeState() {
    return _CertificationPageState();
  }
}

class _CertificationPageState extends BaseBlocPageState<CertificationBloc> {
  @override
  Widget buildChild(BuildContext context, MTheme theme) {
    return Scaffold(
      appBar: AppBar(
        leading: BackButton(
          onPressed: () {
            Routers.pop(context);
          },
        ),
        centerTitle: true,
        title: Text("实名认证"),
      ),
      body: SafeArea(
        child: Container(
          height: double.infinity,
          color: Colors.white,
          child: SingleChildScrollView(
            child: Column(
              children: [
                Divider(
                  height: 10,
                  thickness: 10,
                  color: theme.themeColor.themeBgColor,
                ),
                _buildIDCARD(theme),
                Divider(
                  height: 1,
                  color: theme.themeColor.themeBgColor,
                ),
                Container(
                  alignment: Alignment.centerLeft,
                  child: Text("请您上传身份证正反面"),
                  padding: EdgeInsets.only(left: 24.0, right: 24.0, top: 15.0),
                ),
                10.vGapDp,
                Row(children: [
                  Expanded(
                    child: StreamBuilder(
                      stream: bloc.idCardFront,
                      builder: (context,
                          AsyncSnapshot<SaveCertifyPhotoBean.Data> snapshot) {
                        return BaseImgPicker<SaveCertifyPhotoBean.Data>(
                          snapshot.data,
                          onSuccess: (path) {
                            bloc.uploadImage(
                                context, path, CertificationBloc.TYPE_ID_FRONT);
                          },
                          onDelete: (data) {
                            bloc.deleteCertify(data);
                          },
                          onFailure: (err) {},
                          tip: "国徽面",
                          imagePath: snapshot?.data?.photoUrl ?? '',
                          showLoading: (snapshot.hasData &&
                              snapshot.data.photoUrl == "-"),
                        );
                      },
                    ),
                  ),
                  10.hGapDp,
                  Expanded(
                    child: StreamBuilder(
                      stream: bloc.idCardBg,
                      builder: (context,
                          AsyncSnapshot<SaveCertifyPhotoBean.Data> snapshot) {
                        return BaseImgPicker<SaveCertifyPhotoBean.Data>(
                          snapshot.data,
                          onSuccess: (path) {
                            bloc.uploadImage(
                                context, path, CertificationBloc.TYPE_ID_BACK);
                          },
                          onDelete: (data) {
                            bloc.deleteCertify(data);
                          },
                          onFailure: (err) {},
                          tip: "人像面",
                          imagePath: snapshot?.data?.photoUrl ?? '',
                          showLoading: (snapshot.hasData &&
                              snapshot.data.photoUrl == "-"),
                        );
                      },
                    ),
                  ),
                ]),
                Padding(
                  padding: const EdgeInsets.only(top: 24.0),
                  child: Divider(
                    height: 10,
                    thickness: 10,
                    color: theme.themeColor.themeBgColor,
                  ),
                ),
                Container(
                  alignment: Alignment.centerLeft,
                  child: Text("请您上传执业证、资格证、专业技术资格证(职称证)"),
                  padding: EdgeInsets.only(left: 24.0, right: 24.0, top: 15.0),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 24.0, right: 24.0),
                  child: _buildPracticeCertificateNumber(theme),
                ),
                Divider(
                  height: 1,
                  color: theme.themeColor.themeBgColor,
                ),
                Container(
                  alignment: Alignment.centerLeft,
                  child: Text("执业证（照片页和信息页必传，至少2张）"),
                  padding: EdgeInsets.only(left: 24.0, right: 24.0, top: 15.0),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 24.0, right: 24.0),
                  child: _buildProfessionPic(theme),
                ),
                Container(
                  alignment: Alignment.centerLeft,
                  child: Text("资格证（照片页和信息页必传，至少2张）"),
                  padding: EdgeInsets.only(left: 24.0, right: 24.0, top: 15.0),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 24.0, right: 24.0),
                  child: _buildQualificationPic(theme),
                ),
                Container(
                  alignment: Alignment.centerLeft,
                  child: Text("职称证（非必传）"),
                  padding: EdgeInsets.only(left: 24.0, right: 24.0, top: 15.0),
                ),
                Padding(
                  padding: EdgeInsets.only(left: 24.0, right: 24.0),
                  child: _buildTitlePic(theme),
                ),
                20.vGapDp,
                Padding(
                  padding: EdgeInsets.only(left: 24.0, right: 24.0),
                  child: StreamBuilder(
                    stream: bloc.loadingStatus,
                    initialData: false,
                    builder: (context, AsyncSnapshot<bool> loading) {
                      return Padding(
                        padding: const EdgeInsets.only(top: 15.0),
                        child: peachButtonBuilder(
                          onTap: () {
                            if (!loading.data)
                              bloc.saveCertificationInfo(context);
                          },
                          text: loading.data ? "请求中..." : "提交",
                        ),
                      );
                    },
                  ),
                ),
                30.vGapDp,
              ],
            ),
          ),
        ),
      ),
    );
  }

  Widget buildImgUploader(MTheme theme) {
    return Wrap();
  }

  ///身份证
  Widget _buildIDCARD(MTheme theme) {
    return Container(
      color: Colors.white,
      width: double.infinity,
      padding: EdgeInsets.only(right: 24.0, left: 24.0),
      margin: EdgeInsets.only(top: 10),
      child: StreamBuilder(
        stream: bloc.idCard,
        builder: (context, AsyncSnapshot<String> snapshot) {
          return Row(
            children: [
              10.hGapDp,
              Expanded(
                child: Text("输入身份证"),
              ),
              Expanded(
                child: TextField(
                  focusNode: FocusNode(),
                  onChanged: (value) {
                    bloc.editIDCARDChanged(value);
                  },
                  controller: TextEditingController(text: snapshot?.data ?? ""),
                  cursorColor: Colors.grey,
                  textAlign: TextAlign.right,
                  strutStyle: StrutStyle(
                      fontSize: theme.themeFontSize.fontSizeBig, height: 1),
                  style: TextStyle(
                      color: Colors.black,
                      fontSize: theme.themeFontSize.fontSizeBig),
                  decoration: InputDecoration(
                    border: InputBorder.none,
                    hintText: "*请输入身份证",
                  ),
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  ///请输入执业证书编号
  Widget _buildPracticeCertificateNumber(MTheme theme) {
    return Container(
      color: Colors.white,
      width: double.infinity,
      padding: EdgeInsets.only(right: 10),
      margin: EdgeInsets.only(top: 10),
      child: StreamBuilder(
        stream: bloc.professionNumber,
        builder: (context, AsyncSnapshot<String> snapshot) {
          return Row(
            children: [
              10.hGapDp,
              Expanded(
                child: Text("执业证书编号"),
              ),
              Expanded(
                child: TextField(
                  focusNode: FocusNode(),
                  onChanged: (value) {
                    bloc.editProfessionNumberChanged(value);
                  },
                  controller: TextEditingController(text: snapshot?.data ?? ""),
                  cursorColor: Colors.grey,
                  textAlign: TextAlign.right,
                  strutStyle: StrutStyle(
                      fontSize: theme.themeFontSize.fontSizeBig, height: 1),
                  style: TextStyle(
                      color: Colors.black,
                      fontSize: theme.themeFontSize.fontSizeBig),
                  decoration: InputDecoration(
                      border: InputBorder.none, hintText: "*请输入执业证书编号"),
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  @override
  CertificationBloc generateBloc() {
    return CertificationBloc();
  }

  ///执业证
  _buildProfessionPic(MTheme theme) {
    return Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.all(10),
      child: StreamBuilder(
        stream: bloc.professionPhoto,
        builder:
            (context, AsyncSnapshot<List<SaveCertifyPhotoBean.Data>> snapshot) {
          return snapshot.hasData
              ? Wrap(
                  alignment: WrapAlignment.start,
                  spacing: 10,
                  runSpacing: 10,
                  children: snapshot.data?.map((e) {
                    return BaseImgPicker<SaveCertifyPhotoBean.Data>(
                      e,
                      onSuccess: (path) {
                        bloc.uploadImage(
                            context, path, CertificationBloc.TYPE_PROFESSION);
                      },
                      onDelete: (data) {
                        bloc.deleteCertify(data);
                      },
                      onFailure: (err) {},
                      tip: "执业证",
                      imagePath: e.photoUrl ?? '',
                      showLoading: e.photoUrl == "-",
                    );
                  })?.toList(),
                )
              : SizedBox();
        },
      ),
    );
  }

  ///资格证
  _buildQualificationPic(MTheme theme) {
    return Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.all(10),
      child: StreamBuilder(
        stream: bloc.qualificationPhoto,
        builder:
            (context, AsyncSnapshot<List<SaveCertifyPhotoBean.Data>> snapshot) {
          return snapshot.hasData
              ? Wrap(
                  alignment: WrapAlignment.start,
                  spacing: 10,
                  runSpacing: 10,
                  children: snapshot.data?.map((e) {
                    return BaseImgPicker<SaveCertifyPhotoBean.Data>(
                      e,
                      onSuccess: (path) {
                        bloc.uploadImage(context, path,
                            CertificationBloc.TYPE_QUALIFICATION);
                      },
                      onDelete: (data) {
                        bloc.deleteCertify(data);
                      },
                      onFailure: (err) {
                        ToastUtil.error(err);
                      },
                      tip: "资格证",
                      imagePath: e.photoUrl ?? '',
                      showLoading: e.photoUrl == '-',
                    );
                  })?.toList(),
                )
              : SizedBox();
        },
      ),
    );
  }

  ///职称证
  _buildTitlePic(MTheme theme) {
    return Container(
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.all(10),
      child: StreamBuilder(
        stream: bloc.titleCertificate,
        builder:
            (context, AsyncSnapshot<List<SaveCertifyPhotoBean.Data>> snapshot) {
          return snapshot.hasData
              ? Wrap(
                  alignment: WrapAlignment.start,
                  spacing: 10,
                  runSpacing: 10,
                  children: snapshot.data?.map((e) {
                    return BaseImgPicker<SaveCertifyPhotoBean.Data>(
                      e,
                      onSuccess: (path) {
                        bloc.uploadImage(context, path,
                            CertificationBloc.TYPE_TITLE_CERTIFICATE);
                      },
                      onDelete: (data) {
                        bloc.deleteCertify(data);
                      },
                      onFailure: (err) {},
                      tip: "职称证",
                      imagePath: e.photoUrl ?? '',
                      showLoading: e.photoUrl == "-",
                    );
                  })?.toList(),
                )
              : SizedBox();
        },
      ),
    );
  }
}
